<template>
    <h1>{{ article.title }}</h1>
    <img :src="article.photoPath" alt="">
    <h3>{{ article.summary }}</h3>
    <h5>{{ article.content }}</h5>
</template>

<script>
import { onMounted, reactive } from "vue";
import $ from "jquery";

export default {
    props: ["articleId"],
    setup(props) {
        let article = reactive({});
        onMounted(() => {
            $.ajax({
                url: "/detail/" + props.articleId,
                type: "get",
                success(resp) {
                    Object.assign(article, resp.data); 
                },
            });
        });

        return {
            article,
        };
    },
};
</script>

<style scoped></style>
